<template>
  <div class="app-container">
      <el-card class="operate-container" shadow="never">
      <i class="el-icon-tickets"></i>
      <span>分润打款记录</span><span class="warm-tip">(当前页面的金额单位为 {{moneyIcon}})</span>
      <!-- <el-button class="btn-add" @click="handleAddNotice()" size="mini">
        添加新公告
      </el-button> -->
    </el-card>
    <el-table ref="productTable"
                :data="list"
                style="width: 100%"
                v-loading="listLoading"
                border>
        <el-table-column label="编号" width="100" align="center">
          <template slot-scope="scope">{{scope.row.id}}</template>
        </el-table-column>
        <el-table-column label="打款账号" width="400" align="center">
          <template slot-scope="scope">{{scope.row.payAccount}}</template>
        </el-table-column>
        <el-table-column label="打款金额" width="400" align="center">
          <template slot-scope="scope">{{scope.row.bonusAmount}}</template>
        </el-table-column>
        <el-table-column label="更新时间"  align="center">
          <template slot-scope="scope">{{scope.row.createTime}}</template>
        </el-table-column>
        <!-- <el-table-column label="操作" width="360" align="center">
          <template slot-scope="scope">
              <el-button
                size="mini"
                @click="handleEditNotice(scope.$index, scope.row)">编辑
              </el-button>
              <el-button
                size="mini"
                type="danger"
                @click="handleDeleteNotice(scope.$index, scope.row)">删除
              </el-button>
          </template>
        </el-table-column> -->
    </el-table>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total, sizes,prev, pager, next,jumper"
        :page-size="listQuery.pageSize"
        :page-sizes="[30,40,60]"
        :current-page.sync="listQuery.pageNum"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>
<script>
    import {

    getOperationList
    // getCurNoticeRole,
    // updateNoticeRoleInfo,
  } from '@/api/user'
//   import {fetchList as fetchProductAttrList} from '@/api/productAttr'
//   import {fetchList as fetchBrandList} from '@/api/brand'
//   import {fetchListWithChildren} from '@/api/productCate'

  const defaultListQuery = {
    // keyword: null,
    pageNum: 1,
    pageSize: 20,
    // publishStatus: null,
    // verifyStatus: null,
    // productSn: null,
    // productCategoryId: null,
    // brandId: null
  };
  export default {
    name: "OperationList",
    data() {
      return {
          list:[],
          moneyIcon:process.env.MONEY_ICON,
          listQuery:Object.assign({}, defaultListQuery),
          newForm:{//新增公告弹框里内容
            content:'',
            // nickName:'',
            // password:'',
            // note:'',
            // email:'',
            //icon:"",//公告头像
          },
          editForm: {//编辑公告弹框里内容
            currentUId:0,
            content:'',
            // nickName:'',
            // password:'',
            // note:'',
          },
          newFormRules:{
            content:[
                { required: true,  message: '公告内容不能为空', trigger: ['blur','change']}
             ],
            //  nickName:[
            //     { required: true,  message: '公告名不能为空', trigger: ['blur','change']}
            //  ],
            //  password:[
            //     { required: true,  message: '密码不能为空', trigger: ['blur','change']},
            //     {min:6, max:20, message:"密码长度不能大于20", trigger:['blur','change']}
            //  ],
             
          },
          editFormRules:{
            content:[
                { required: true,  message: '公告内容不能为空', trigger: ['blur','change']}
             ],
            //  nickName:[
            //     { required: true,  message: '公告名不能为空', trigger: ['blur','change']}
            //  ],
          },
          currentOpeId:0,//编辑角色的当前公告id
          allRoleList:[],//所有的角色列表
          NoticeRoleId:[],//当前公告的role id
          selectedRole:[],//公告弹窗里选择的选择的role id
          isNewNoticeOpen:false,//新增公告弹窗
          isEditNoticeOpen:false,//编辑公告弹窗
          //isRoleOpen:false,//编辑角色弹窗
      }
    },  
    created() {
      this.getList();
     // this.getRoleList();
    },
    methods:{
      getList() {
        this.listLoading = true;
        getOperationList(this.listQuery).then(response => {
            this.listLoading = false;
            this.list = response.data;
            //this.total = response.data.total;
            console.log(this.list);
        });
      },
      handleEditNotice(index,item){
        this.isEditNoticeOpen = true;
        this.editForm.currentUId = item.id;
        this.editForm.content = item.content;
        this.editForm.nickName = item.nickName;
        this.editForm.note = item.note;
      },

      handleAddNotice(){
          this.isNewNoticeOpen = true;
      },
      
      saveNewNotice(){
          console.log(this.newForm);
          this.newForm.content = this.newForm.content;
        newNoticeInfo(this.newForm).then(response=>{
            if(response.code == 200){
                this.$message({
                  message: '新建成功',
                  type: 'success',
                  duration: 1000
              });
            this.isNewNoticeOpen=false;
            this.getList();
            }
        })
      },
      saveNoticeInfo(){
          //console.log(this.editForm);
          let passTemp= this.editForm.password;
          if (!passTemp){
            delete this.editForm.password
          }
          //console.log(this.editForm);
        updateNoticeInfo(this.editForm.currentUId,this.editForm).then(response=>{
            this.$message({
                message: '修改成功',
                type: 'success',
                duration: 1000
            });
            this.isEditNoticeOpen=false;
            this.getList();
        });
      },
      handleUpdateRole(index,item){
        console.log(item.id);
        this.currentOpeId = item.id;
        this.getCurNoticeRole();
      },
      // getRoleList() {
      //   let self = this;
      //   fetchRoleList().then(response => {
      //       if(response.code === 200){
      //         self.allRoleList = response.data;
      //       }
      //   });
      // },
      // getCurNoticeRole(){
      //   let self = this;
      //   let id = self.currentOpeId;
      //   getCurNoticeRole(id).then(res =>{
      //     let roleInfo = res.data;
      //     let roleIds =[];
      //     roleInfo.forEach(item=>{
      //       roleIds.push(item.id);
      //     })
      //     self.NoticeRoleId = roleIds; //当前公告的role id
      //     self.selectedRole = JSON.parse(JSON.stringify(roleIds));
      //     self.isRoleOpen =true;
      //   })
      // },
      // roleChange(){
      //   console.log(this.selectedRole)
      // },
      // saveNoticeRoleInfo(){
      //   let self = this;
      //   if (!self.selectedRole || self.selectedRole.length ==0){
      //     this.$message({
      //       message: '请选择合适的角色',
      //       type: 'warning',
      //       duration: 1000
      //     });
      //     return;
      //   }
      //   let params = new URLSearchParams();
      //   params.append('adminId', self.currentOpeId);
      //   params.append('roleIds', self.selectedRole);
      //   // updateNoticeRoleInfo(params).then(res=>{
      //   //   if(res.code === 200){
      //   //     this.$message({
      //   //       message: '角色修改成功',
      //   //       type: 'success',
      //   //       duration: 1000
      //   //     });
      //   //     self.isRoleOpen = false;
      //   //     self.getList();
      //   //   }
      //   // })
      // },
      handleDeleteNotice(index,item){
          let self = this;
           self.$confirm('删除该公告, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
            }).then(() => {
                console.log(11);
                deleteNotice(item.id).then(response=>{
                    console.log(22)
                    if(response.code === 200){
                        self.$message({
                            message: '删除成功',
                            type: 'success',
                            duration: 1000
                        });
                        self.getList();
                    }
                });
            }).catch(() => {
                // self.$message({
                //     type: 'info',
                //     message: '已取消删除'
                // });          
            });
      },
      
    }
  }
</script>
<style scoped>
.btn-add{
    font-size: 14px;
    padding: 10px;
    margin-top: -8px;
  color:#fff;
  background-color:#417FF6;
}
/* 弹出框的宽度 */
.adjustmentBox >>> .el-dialog{
  width: 28rem;
} 
</style>